<!DOCTYPE html>
<html lang="en" xmlns:v-bind="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <meta content="text/html;charset=UTF-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">

    <link rel="stylesheet" href="../lib/elementui/lib/theme-default/index.css"/>

    <!-- 引入组件库 -->
    <!-- 先引入 Vue -->
    <script src="../lib/jquery/jquery-3.2.1.min.js"></script>
    <script src="../lib/vue/vue.js"></script>
    <script src="../lib/vue/vue-resource.min.js"></script>
    <script src="../lib/vue/vue-router.js"></script>
    <script src="../lib/elementui/lib/index.js"></script>
    <script src="../js/common/util/czy.vue.util.js"></script>
    <title>Title</title>
</head>


<body>

<div id="test">
    <el-button
            id="test"
            type="primary"
            @click="openFullScreen"
            v-loading.fullscreen.lock="fullscreenLoading">
        显示整页加载，3 秒后消失
    </el-button>
</div>

</body>


<script types="text/javascript">

    var test = new Vue({
        el: "#test",
        data: {
            fullscreenLoading: false
        },
        methods: {
            openFullScreen: function () {
//                this.fullscreenLoading = true;
//                var loadingInstance = window.ELEMENT.Loading.service(
//                    {
//                        fullscreen: true
//                    }
//                    );
                czy.mask.open();
            }
        }
    });


</script>

</html>